//板块二，点击查看活动列表与管理，实现页面切换
function dianji(num) {
    $('#cha9,#cha8').eq(num).css({
        display: 'block'
    }).siblings('#cha9,#cha8').css({
        display: 'none'
    })
}

//板块二，查询商品模态框
$('#myModal').on('shown.bs.modal', function() {
    $('#myInput').focus()
})

//板块一，删除
function cx_delRow(ID) {
    console.log(ID)
    for (var i = 0; i < cx_activity.length; i++) {
        if (cx_activity[i].ID == ID) {
            cx_activity.splice(i, 1)
        }
    }
    console.log(cx_activity)
    cx_showTable(cx_dangqianyeNum)
    cx_showYema()
}

//板块一，修改模态框
$('#cx_exampleModal').on('show.bs.modal', function(event) {
    var button = $(event.relatedTarget)
    var ID = button.data('id')
    var name = button.data('name')
    var content = button.data('content')
    var type = button.data('type')
    var modal = $(this)

    modal.find('.modal-body #spID').val(ID)
    modal.find('.modal-body #spName').val(name)
    modal.find('.modal-body #spContent').val(content)
    modal.find('.modal-body input[name="optionsRadios2"]:checked').val(type)
})

//板块一，修改
function cx_changeSp() {
    var ID = $('#spID').val()
    var name = $('#spName').val()
    var content = $('#spContent').val()
    var type = $('input[name="optionsRadios2"]:checked').val()
    console.log(ID, name, content, type)
    var newSp = {
        ID: ID,
        name: name,
        content: content,
        type: type
    }

    for (var i = 0; i < cx_activity.length; i++) {
        if (ID == cx_activity[i].ID) {
            cx_activity.splice(i, 1, newSp)
        }
    }
    console.log(cx_activity)
    $('#cx_exampleModal').modal('hide')
    cx_showTable(cx_dangqianyeNum)

}

//板块一，添加模态框
$('#cx_addsp').on('show.bs.modal', function(event) {
    var ID = parseInt(Math.random() * 1000000)
    var modal = $(this)
    modal.find('.modal-body #addSpID').val(ID)
    modal.find('.modal-body #addSpName').val('')
    modal.find('.modal-body #addSpContent').val('')
})

//板块一，添加
function cx_addspp() {
    console.log(123123)
    var ID = $('#addSpID').val()
    var name = $('#addSpName').val()
    var content = $('#addSpContent').val()
    var type = $('input[name="optionsRadios1"]:checked').val()
    console.log(ID, name, type)
    var newSp = {
        ID: ID,
        name: name,
        content: content,
        type: type
    }
    console.log(newSp)
    cx_activity.push(newSp)
    $('#cx_addsp').modal('hide')
    cx_showTable(cx_dangqianyeNum)
    cx_showYema()
}

function cx_addspp2() {
    console.log(123)
    var ID = parseInt(Math.random() * 1000000)
    var name = $('#cx_mc').val()
    var content = $('#cx_miaosu').val()
    var type = $('input[name="inlineRadioOptions"]:checked').val()
    console.log(ID, name, type)
    var newSp = {
        ID: ID,
        name: name,
        content: content,
        type: type
    }
    cx_activity.push(newSp)
    console.log(newSp)
    cx_showTable(cx_dangqianyeNum)
    cx_showYema()
    var name = $('#cx_mc').val("")
    var content = $('#cx_miaosu').val("")
}

var cx_maxPage = 0
var cx_dangqianyeNum = 1
cx_showYema()
cx_showTable(cx_dangqianyeNum)

//板块一，控制数据，渲染表格
function cx_showTable(dangqianye) {
    let qishi = (dangqianye - 1) * 3
    let data = cx_activity.slice(qishi, qishi + 3)
    $('#mycx_activity').html('')
    for (var i = 0; i < data.length; i++) {
        $('#mycx_activity').append(`<tr>
        <td>${data[i].ID}</td>
        <td>${data[i].name}</td>
        <td>${data[i].content}</td>
        <td>${
            data[i].type=="开启"?`<button type="button" class="btn btn-success btn-xs">${data[i].type}</button>`:`<button type="button" class="btn btn-danger btn-xs">${data[i].type}</button>`
        }
        </td>
        <td>
            
            <button type="button" class="btn btn-warning" data-toggle="modal" data-target="#cx_exampleModal"
            data-id="${data[i].ID}"
            data-name="${data[i].name}"
            data-content="${data[i].content}"
            data-type="${data[i].type}"
            >修改</button>
            <button onclick="cx_delRow(${data[i].ID})" type="button" class="btn btn-danger">删除</button>
                </td>
        </tr>`)
    }
    $('.pages').eq(dangqianye - 1).addClass('active').siblings().removeClass('active')
}

//板块一，控制页码，渲染表格
function cx_showYema() {
    $('.pages').remove()
    cx_maxPage = Math.ceil(cx_activity.length / 3)
    for (var i = 1; i <= cx_maxPage; i++) {
        $('#next').before(`
        <li class='pages' onclick='cx_changeYema(this)'><a href="#">${i}</a></li>
        `)
    }
    $('pages').eq(cx_dangqianyeNum - 1).addClass('active').siblings().removeClass('active')
}

//板块一，当前页的页码的改变
function cx_changeYema(obj) {
    //console.log($(obj).children().text())
    cx_dangqianyeNum = parseInt($(obj).children().text())
    cx_showTable(cx_dangqianyeNum)
}

function cx_prevPage() {
    if (cx_dangqianyeNum > 1) {
        cx_dangqianyeNum = cx_dangqianyeNum - 1
        cx_showTable(cx_dangqianyeNum)
    }
}

function cx_nextPage() {
    if (cx_dangqianyeNum < cx_maxPage) {
        cx_dangqianyeNum = cx_dangqianyeNum + 1
        cx_showTable(cx_dangqianyeNum)
    }
}

var maxPage = 0
var dangqianyeNum = 1
showTable(dangqianyeNum)
showYema()

//板块二，用来渲染页面
function showTable(dangqianye) {
    let qishi = (dangqianye - 1) * 3
    let data = active.slice(qishi, qishi + 3)
    $('#activetable').html('')
    for (var i = 0; i < data.length; i++) {
        $('#activetable').append(
                `<tr>
            <td>${data[i].id}</td>
            <td>${data[i].name}</td>
            <td>${data[i].kind}</td>
            <td>${data[i].start}</td>
            <td>${data[i].end}</td>
            <td>${data[i].remark}</td>
            <td>${
                data[i].type=="开启"?`<button type="button" class="btn btn-success btn-xs">${data[i].type}</button>`:`<button type="button" class="btn btn-danger btn-xs">${data[i].type}</button>`
            }
                
                <button type="button" class="btn btn-info btn-xs" onclick="dianji(0)">管理</button>
            </td>
            <td>    
                <button type="button" class="btn btn-warning btn-xs" data-toggle="modal" data-target="#exampleModal"
                data-id="${data[i].id}"
                data-name="${data[i].name}"
                data-kind="${data[i].kind}"
                data-start="${data[i].start}"
                data-end="${data[i].end}" 
                data-remark="${data[i].remark}"
                data-type="${data[i].type}"   
                >修改</button>
                <button type="button" class="btn btn-danger btn-xs" onclick="delRow(${data[i].id})">删除</button>
            </td>
            
          </tr>`)
    }
    $('.page').eq(dangqianye - 1).addClass('active').siblings().removeClass('active')
}

//板块二
function showYema() {
    $('.page').remove()
    maxPage = Math.ceil(active.length / 3)
    for (var i = 1; i <= maxPage; i++) {
        $('#nex').before(
            `<li class='page' onclick='changeYema(this)'><a href="#">${i}</a></li>`
        )
    }
    $('.page').eq(dangqianyeNum - 1).addClass('active').siblings().removeClass('active')

}

//板块二
function changeYema(obj) {
    console.log($(obj).children().text())
    dangqianyeNum = parseInt($(obj).children().text())
    showTable(dangqianyeNum)
}

// 板块二，上一页 下一页
function prePage() {
    if (dangqianyeNum > 1) {
        dangqianyeNum = dangqianyeNum - 1
        showTable(dangqianyeNum)
    }
}

function nextPage() {
    if (dangqianyeNum < maxPage) {
        dangqianyeNum = dangqianyeNum + 1
        showTable(dangqianyeNum)
    }
}

//板块二 删除
function delRow(id) {
    for (var i = 0; i < active.length; i++) {
        if (active[i].id == id) {
            active.splice(i, 1)
        }
    }
    showTable(dangqianyeNum)
    showYema()
}

//板块二 修改
$('#exampleModal').on('show.bs.modal', function(event) {
    var button = $(event.relatedTarget)
    var id = button.data('id')
    var name = button.data('name')
    var kind = button.data('kind')
    var start = button.data('start')
    var end = button.data('end')
    var remark = button.data('remark')
    var type = button.data('type')
    var modal = $(this)
    modal.find('.modal-body #actId').val(id)
    modal.find('.modal-body #actName').val(name)
    modal.find('.modal-body #actKind').val(kind)
    modal.find('.modal-body #actStart').val(start)
    modal.find('.modal-body #actEnd').val(end)
    modal.find('.modal-body #actRemark').val(remark)
    modal.find('.modal-body #actType').val(type)
})

function changeAct() {
    var id = $('#actId').val()
    var name = $('#actName').val()
    var kind = $('#actKind').val()
    var start = $('#actStart').val()
    var end = $('#actEnd').val()
    var remark = $('#actRemark').val()
    var type = $('input[name="optionsRadios2"]:checked').val()
    console.log(id, name, kind, start, end, remark,type)
    var newAct = {
        id: id,
        name: name,
        kind: kind,
        start: start,
        end: end,
        remark: remark,
        type: type
    }
    for (var i = 0; i < active.length; i++) {
        if (active[i].id == id) {
            active.splice(i, 1, newAct)
        }
    }
    $('#exampleModal').modal('hide')
    showTable(dangqianyeNum)
}
// 增加
function addAct() {
    var id = parseInt(Math.random() * 1000000)
    var name = $('#addname').val()
    var kind = $('#addkind').val()
    var start = $('#addstart').val()
    var end = $('#addend').val()
    var remark = $('#addremark').val()
    var type = $('input[name="optionsRadios"]:checked').val()
    var newadd = {
        id: id,
        name: name,
        kind: kind,
        start: start,
        end: end,
        remark: remark,
        type: type
    }
    active.push(newadd)
    showTable(dangqianyeNum)
    showYema()
    var name = $('#addname').val("")
    var kind = $('#addkind').val("")
    var start = $('#addstart').val("")
    var end = $('#addend').val("")
    var remark = $('#addremark').val("")
}